﻿<%@ page import="com.yunzhong.appointment.config.Const" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<%@taglib uri="http://shiro.apache.org/tags" prefix="shiro" %>
<%@include file="../common/common.jsp"%>
<html>
	<head>
		<link rel="stylesheet" type="text/css" href="../../../static/css/bootstrap.min.css"/>
		<script type="text/javascript" src="../../../static/js/jquery-2.2.4.min.js"></script>
		<script type="text/javascript" src="../../../static/js/jquery.tips.js"></script>
		<script type="text/javascript" src="../../../static/js/bootstrap.min.js" ></script>
		<link rel="stylesheet" type="text/css" href="../../../static/css/bootstrap-datetimepicker.min.css"/>
		<script type="text/javascript" src="../../../static/js/bootstrap-datetimepicker.min.js" ></script>
		<script type="text/javascript" src="../../../static/js/bootstrap-datetimepicker.zh-CN.js" ></script>
		<script src="../../../static/js/bootbox.js"></script>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>云众科技网上预约挂号系统</title>
	</head>
	<style>
		html body{
			width: 100%;
		}
		.piaoyikuang{
			border: 1px solid #66AFE9;
			border-radius: 10px;
		}
		.piaoyi{
			float: left;
			width: 100px;
			height: 30px;
			border: 0px solid #66AFE9;
			text-align: center;
		}
		.ks-left{
			border: 1px solid #66AFE9;
			border-radius: 10px;
			margin-right: 0px;
		}
		.ks-right{
			border: 0px solid #66AFE9;
			border-radius: 10px;
		}
	</style>
	<body>
		<!--
        	作者：石洪刚
        	时间：2017年10月26日11:44:45
        	描述：个人中心
        -->
        <div class="container" style="margin-top: 10px;">
        	<form class="form form-horizontal" name="infoForm" method="post" action="javascript:doSub()">
				<shiro:hasRole name="<%=Const.ROLE_PATIENT %>">
				<input type="hidden" name="patientId" id="id" value="${pat.patientId}">
				<div class="form-group">
				<label class="control-label col-xs-2">手机号码：</label>
				<div class="col-xs-5">
					<input class="form-control" type="text" id="tel" value="${tel}" readonly="readonly"/>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-xs-2">姓名：</label>
				<div class="col-xs-5">
					<input class="form-control" type="text" id="name" value="${pat.patientName}" readonly="readonly"/>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-xs-2">身份证号：</label>
				<div class="col-xs-5">
					<input class="form-control" type="text" id="uid" value="${ide}" readonly="readonly" />
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-xs-2">性别：</label>
				<div class="col-xs-5">
					<div class="radio">
					   <label>
					      <input onclick="clearr()"  type="radio" name="patientSex" id="sex1"  value="男" ${pat.patientSex=="男"?"checked":""} /> 男
					   </label>
					   &nbsp;&nbsp;
					   <label> 
					     <input onclick="clearr()" type="radio" name="patientSex" id="sex2" value="女" ${pat.patientSex=="女"?"checked":""} /> 女
					  </label>
						<input type="hidden" value="未选择性别，请选择"  style="color: red;border: none" id="tishi" >
					</div>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-xs-2">出生日期：</label>
				<div class="col-xs-5">
					<input class="form-control" type="text" name="patientBirth" value="<fmt:formatDate value="${pat.patientBirth}" pattern="yyyy-MM-dd"></fmt:formatDate>" id="mydate"/>
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-xs-2 ">现居住地：</label>
				<div class="col-sm-2">
					<select id="pro" class="form-control"  name="provinceId" onchange="chocity(this)">
						<option value="" >请选择省份</option>
					</select>

				</div>
				<div class="col-sm-2">
					<select class="form-control" id="cit" name="cityId" onchange="choarea(this)" >
						<option value="" >请选择城市</option>
					</select>


				</div>
				<div class="col-sm-2">
					<select class="form-control" name="areaId" id="are">
						<option value="" >请选择区县</option>
					</select>
					<input type="hidden" name="areaName" value="">
				</div>
			</div>
			<div class="form-group text-center">
				<button class="btn btn-lg btn-warning" type="submit">修&nbsp;&nbsp;改</button>
			</div>
				</shiro:hasRole>
			<shiro:lacksRole name="<%=Const.ROLE_PATIENT %>">
			<c:if test="${person==null }">
					暂无信息
			</c:if>
			</shiro:lacksRole>
        	</form>
        </div>
	</body>
	<script type="text/javascript">

		var cc="${pat.cityId}";
		var aa="${pat.areaId}";
		$(function () {

			var pro = ${pat.provinceId}


			var url = "/personal/queryPro"
			var data="";

			$.post(url,{"data":data},function (res) {
				console.log(res)
				$("#pro").empty();
					var ops="<option value=\"\" id=\"pro\">请选择省份</option>";
					$.each(res,function (i,item) {
						ops += "<option value='" + item.provinceId + "'";
						if(item.provinceId==${pat.provinceId}){
							ops += "selected";
						}
						ops += " >" + item.provinceName + "</option>";
					});
				$(ops).appendTo("#pro")

			})

			chocity(pro)
			choarea(cc)

		})



		function chocity(pro) {
			var url = "/personal/queryCity";
			if (pro.value!=undefined){
				$.post(url,{"id":pro.value},function (resp) {
					console.log(resp)
					$("#cit").empty();
					var ops="<option value='"+""+"'>===请选择===</option>";
					$.each(resp,function (i,item) {
						ops+="<option value='"+item.cityId+"'";
						if(item.cityId==${pat.cityId}){
							ops += "selected";
						}
						ops+=">"+item.cityName+"</option>";

					});
					$(ops).appendTo("#cit")
				},"json");


			}else {

				$.post(url,{"id":pro},function (resp) {

					console.log(resp)
					$("#cit").empty();
					var ops="<option value='"+""+"'>===请选择===</option>";
					$.each(resp,function (i,ite) {
						ops+="<option value='"+ite.cityId+"'";
						if(ite.cityId==${pat.cityId}){
							ops += "selected";
						}
						ops+=">"+ite.cityName+"</option>";
					});
					$(ops).appendTo("#cit")
				},"json");
			}

		}


		function choarea(cit) {
			var url = "/personal/queryArea";
			if (cit.value != undefined) {
				$.post(url,{"id":cit.value},function (resp) {
					console.log(resp)
					$("#are").empty();
					var ops="<option value='"+""+"'>===请选择===</option>";
					$.each(resp,function (i,item) {
						ops+="<option value='"+item.areaId+"'";
						if(item.areaId==${pat.areaId}){
							ops += "selected";
						}
						ops+=">"+item.areaName+"</option>";
					});
					$(ops).appendTo("#are")
				},"json");
			}else {
				$.post(url,{"id":cit},function (re) {
					console.log(re)
					$("#are").empty();
					var ops="<option value='"+""+"'>===请选择===</option>";
					$.each(re,function (i,it) {
						ops+="<option value='"+it.areaId+"'";
						if(it.areaId==${pat.areaId}){
							ops += "selected";
						}
						ops+=">"+it.areaName+"</option>";
					});
					$(ops).appendTo("#are")
				},"json");
			}

		}

		//注册提交
		function doSub(){
			// bootbox.confirm("确定要提交注册信息？",function(result){
			// 	if(result){
			// 		bootbox.alert("修改信息成功");
			// 	}
			// })

			bootbox.confirm("确认修改吗？",function(r){
				if(r){
					var url = "/personal/editsave";
					var data = $("form[name='infoForm']").serialize();
					$.post(url, data, function(responseData) {
						if (responseData.success) {
							bootbox.alert("修改成功",function(){
								location.href = "/personal/querypersonal";
							});
						} else {
							bootbox.alert("修改失败");
						}
					}, "json")
				}
			});
		}
		
		//日期的显示
		$("#mydate").datetimepicker({
	        minView: 'month',
	        format:'yyyy-mm-dd',
	        weekStart: 1,
	        todayBtn: 1,
	        autoclose: 1,
	        todayHighlight: 1,
	        startView: 2,
	        forceParse: 0,
	        showMeridian: 1,
	        endDate:new Date(),
	        language: 'zh-CN',
	        buttonText:'如果你需要修改出生日期,请手动修改'
	    });


		function clearr() {
			document.getElementById("tishi").type="hidden"
		}
	</script>
</html>
